<template>
  <view class="content">
    <view class="text-area">
      <text>回传值：{{ callBackValue }}</text>
    </view>
    
    <!-- 组件A -->
    <ComA :intent="title" />
    
    <!-- 组件B -->
    <ComB @callBackFun="callBack" />
    
    <view class="nav-buttons">
      <button @click="goToComA" size="mini">跳转到组件A页面</button>
      <button @click="goToComB" size="mini">跳转到组件B页面</button>
    </view>
  </view>
</template>

<script>
// 导入组件方式（如果组件在components目录）
import ComA from '@/components/ComA.vue'
import ComB from '@/components/ComB.vue'

export default {
  components: {
    ComA,
    ComB
  },
  data() {
    return {
      title: 'Hello',
      callBackValue: ''
    }
  },
  methods: {
    callBack(msg) {
      console.warn("---IntentPage---callBack-->" + msg)
      this.callBackValue = msg
      uni.showToast({
        title: `收到回传: ${msg}`,
        icon: 'success'
      })
    },
    goToComA() {
      uni.navigateTo({
        url: '/pages/component/ComA/ComA'
      })
    },
    goToComB() {
      uni.navigateTo({
        url: '/pages/component/ComB/ComB'
      })
    }
  }
}
</script>

<style>
.content {
  padding: 30rpx;
}

.text-area {
  margin: 20rpx 0;
  padding: 20rpx;
  background-color: #f0f8ff;
  border-radius: 10rpx;
}

.nav-buttons {
  margin-top: 30rpx;
}

.nav-buttons button {
  margin: 10rpx;
}
</style>